.main{
  .search-public-left{
    float: left;
    overflow: hidden;
    width: 920px;
    margin-left: 10px;
    .public-top{
      width: 868px;
      padding:26px 26px 14px 26px;
      .select-nav{
        font-size: 14px;
        text-align: left;
        font-weight: bold;
        color:#000;
        line-height: 20px;
        width: 66px;
        float: left;
      }
      .selected{
        ul{
          float: left;

          li{
            float: left;
            font-size: 12px;
            padding:4px;
            margin-right: 12px;
            background: #ca0813;
            color: #fff;
            font-weight: normal;
            cursor:pointer;
            span{
              float: left;
              position: relative;
            }
            b{
              cursor: pointer;
              float: right;
              right: -4px;
              top: -1px;
              font-size: 14px;
              width: 10px;
              height: 100%;
              position: relative;
              display: block;



            }
          }
        }
      }
      .type{
        padding-top:22px;
        ul{
          float: left;

          li{
            float: left;
            font-size: 13px;
            padding:4px;
            margin-right: 12px;

            color: #000;
            font-weight: bold;

          }
        }
      }
      .list{
        padding-top:12px;
        ul{
          float: left;
          li{
            float: left;
            font-size: 12px;
            margin-right: 12px;
            font-weight: normal;
            font-family: "Microsoft YaHei","Hiragino Sans GB";
            -webkit-font-smoothing: antialiased;
            line-height: 20px;
            margin-left: 4px;
            cursor: pointer;

            .clolr{
              color:#a9a9a9;
            }
          }
        }
      }
    }
    .public-body{
      margin-top:18px;
      width: 880px;
      padding: 0px 20px;
      -moz-box-shadow: 3px 3px 3px #949494, 2px 2px 5px #333333;
      -webkit-box-shadow: 3px 3px 3px #949494, 2px 2px 5px #333333;
      box-shadow: 3px 3px 3px #949494, 2px 2px 5px #333333;
      float: left;
      margin-bottom: 20px;
      background: #fff;
      .ranking{
        .ranking-sort{
          background: #e9eaeb;
          margin:20px 0;
          ul{
            li{
              float: left;
              padding: 6px 14px;
              color: #8c8c8c;
              font-size: 14px;
              transition: all 0.3s;
              position: relative;
              cursor:pointer;
              & a:hover{
                color:#ca0813;
              }
              &::after{
                content:'';
                width: 2px;
                height: 2px;
                position: absolute;
                right: 0px;
                top:50%;
                //border-radius:50%;
                //font-size: 16px;
                display: block;
                background: #8c8c8c;
                line-height: 22px;
              }
              &:last-child::after{
                content:'';
                width: 0px;
                height: 0px;
                position: absolute;
                right: 0px;
                top:50%;
                //border-radius:50%;
                //font-size: 16px;
                display: block;
                background: #8c8c8c;
                line-height: 22px;


              }
            }

            .active{
              color:#ca0813;
            }
          }
        }
      }
      .all-resource{
        .resource-list{
          border-bottom:2px solid #eee;
          padding-top: 14px;

          .list-details{
            width: 650px;
            float: left;
            .img{
              width:184px;
              height:144px;
            }
            .title{
              width:440px;
              margin-left: 10px;
              h2{
                font-weight: 200;
                font-size: 18px;
                white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
                .small{
                  font-size: 12px;
                  color:#7ca5db;

                }
              }
              span{
                float:left;
                margin-right: 10px;
                margin-top: 14px;
                font-size: 12px;
                color:#7d7d7d;
              }
              p{
                width: 100%;
                height:54px;
                font-size: 12px;
                margin-top: 12px;
                line-height: 18px;
                color:#7d7d7d;
              }
            }

          }
          .course{

            border-top:2px solid #eee;
            border-bottom:2px solid #eee;
            padding:12px;
            width: 670px;
            float: right;
            .course-list{
              margin-right: 8px;
              margin-left: 8px;
              float: left;
              width:150px;
              .course-img{
                width: 100%;
                height: 110px;
              }
            }
            p{
              font-size: 13px;
              color: #7d7d7d;
              text-align: center;
              line-height: 18px;
              display:block;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
              padding:8px 0;
            }
          }
          .pic{
            width: 120px;
            height: 90px;
            margin-top: 12px;
            //border: 1px solid red;
            p{
              text-align: center;
              font-size: 12px;
              color: #7d7d7d;
              line-height: 20px;
              i{
                color: red;
                display: inline-block;
                line-height: 0;

              }
            }
          }
          .ctrl{
            float: right;
            width: 230px;
            margin-top: 12px;
            margin-bottom: 20px;
          }
          .box{
            width: 100px;
            height: 32px;
            text-align: center;
            line-height: 32px;
            float: right;
            cursor:pointer;
          }
          .pay{
            color:#fff;
            background:#ca0813;


          }
          .concern{
            color: #9facc8;
            background: #fff;
            border:1px solid #9facc8;
            margin-right: 20px;
          }
        }

      }
    }
  }
  .search-public-right{
    float: right;
    width: 230px;
    margin-right: 10px;
    padding: 20px;
    h3{
      //border-bottom:2px solid #e9eaeb;
      padding-left: 12px;
      padding-bottom:12px;
      span{
        float: right;
        font-size: 14px;
        color:#3e3d43;
        font-weight: normal;
      }
    }
    ul{

      li{
        padding:12px 20px;

        border-top:1px solid #e9eaeb;
        .img{
          width:100% ;
          height: 100px;
        }
        .info{
          background: #f7f7f7;
          h4{
            font-size: 12px;
            padding: 12px;
            color: #3c3c3c;
            display: block;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
          }
          p{
            font-size: 12px;
            color: #3c3c3c;
            padding-left: 12px;
            padding-bottom: 12px;
            span{
              color: #ca0813;
            }
          }
        }
      }
    }
  }
}